import React, { useCallback, RefObject } from 'react'
import axios from "axios";
import { Toast, Form, Button } from 'react-vant'
import {Input} from 'antd'
import { useNavigate } from 'react-router-dom'

export default () => {
    const navigator = useNavigate()
    const [form] = Form.useForm()
    const onFinish = (values: any) => {
        console.log(values)
        axios.post("http://localhost:4000/login", values).then((res) => {
            console.log(res);
            if (res.data.code === 200) {
                Toast.info('登录成功')
                setTimeout(() => {
                    navigator('/home/my')
                }, 1000)
            } else {
                Toast.info('登录失败')
            }
        });
    }
    return (
        <div className="dynamic-background">
            <Form
            form={form}
            onFinish={onFinish}
            footer={
                <div style={{ margin: '16px 16px 0' }}>
                    <Button round nativeType='submit' type='primary' block>
                        登录
                    </Button>
                </div>
            }>
            <Form.Item
                name='username'
                label='用户名'>
                <Input placeholder='请输入用户名' />
            </Form.Item>
            <Form.Item
                name='password'
                label='密码'>
                <Input placeholder='请输入密码' />
            </Form.Item>
        </Form>
        </div>
        
    )
}